<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>我的购物积分</title>
		<link rel="stylesheet" type="text/css" href="__API__/lib/css/swiper.min.css">
		<link rel="stylesheet" type="text/css" href="__API__/lib/css/mui.css?v=1">
		<link rel="stylesheet" type="text/css" href="__API__/lib/css/mobileSelect.css" />
		<link rel="stylesheet" href="__API__/lib/css/style.css">
		<script type="text/javascript" src="__API__/lib/js/jquery-1.11.0.min.js"></script>
		<script type="text/javascript" src="__API__/lib/js/mui.js"></script>
		<script src="__API__/lib/js/mobileSelect.js" type="text/javascript" charset="utf-8"></script>
		<script src="__API__/lib/js/city.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="__API__/lib/js/swiper.min.js"></script>
		<script type="text/javascript" src="__API__/lib/js/vue.min.js"></script>
		<script type="text/javascript" src="__API__/lib/js/common.js"></script>
		<script type="text/javascript" src="__API__/lib/js/index.js"></script>
	<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script></head>

	<body>
		<div class="page_box" id="app">
			<div class="com_head">
				<h3>{{date}}</h3>
				<ul class="chead_list">
					<li>
						<span>收入</span>
						<span>{{income_price}}</span>
					</li>
					<li>
						<span>支出</span>
						<span>{{expenditure_price > 0 ? '-' + expenditure_price : expenditure_price}}</span>
					</li>
				</ul>
			</div>
			<div class="date_tab">
				<ul class="date_list">
					<li :class="{'on': dateIndex == i}" v-for="(item,i) in dateList" :key="i" @click="onTab(i)">{{item}}</li>
				</ul>
			</div>
			<div class="com_cont">
				<ul class="com_list">
					<li v-for="(item,i) in commissionList">
						<div class="icon"><img src="__API__/lib/images/yj.png" alt=""></div>
						<div class="info">
							<div class="left">
								<h3>{{item.title}}</h3>
								<p>{{item.content}}</p>
								<span class="date">{{item.date}}</span>
							</div>
							<div class="right">{{item.price}}</div>
						</div>
					</li>
				</ul>
			</div>
		</div>
		<script>
			var app = null;
			app = new Vue({
				el: '#app',
				data: {
					date: '2023-07',
					income_price: '774.71',
					expenditure_price: '1000',
					dateList: ['2023-07','2023-06','2023-05','2023-04'],
					dateIndex: 0,
					commissionList: [
						{
							title: '奖励',
							content: '会员 [15609997114] 复购，平台奖励3.96佣金 订单: ordinary2023070125824',
							price: '3.96',
							date: '2023-07-0200:28:03'
						},
						{
							title: '奖励',
							content: '会员 [15609997114] 复购，平台奖励3.96佣金 订单: ordinary2023070125824',
							price: '3.96',
							date: '2023-07-0200:28:03'
						},
						{
							title: '奖励',
							content: '会员 [15609997114] 复购，平台奖励3.96佣金 订单: ordinary2023070125824',
							price: '3.96',
							date: '2023-07-0200:28:03'
						},
						{
							title: '抵扣',
							content: '购买商品抵扣200.00积分',
							price: '-200',
							date: '2023-07-01 09:07:36'
						},
						{
							title: '抵扣',
							content: '购买商品抵扣200.00积分',
							price: '-688',
							date: '2023-07-01 09:07:36'
						},
						{
							title: '奖励',
							content: '会员 [15609997114] 复购，平台奖励3.96佣金 订单: ordinary2023070125824',
							price: '3.96',
							date: '2023-07-0200:28:03'
						},
						{
							title: '抵扣',
							content: '购买商品抵扣200.00积分',
							price: '-800',
							date: '2023-07-01 09:07:36'
						}
					]
				},
				created: function() {
					var that = this;
				},
				methods: {
					goDetail(url) {
						common.openUrl(url)
					},
					onTab(i){
						this.dateIndex = i;
					}
				}
			});
		</script>
	</body>

</html>
